<script type="application/javascript" src="http://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
<style>
    .logistics{
        display: none;
    }
    .row-flex {
        display: flex;
    }
    .main-type{
        position: relative;
    }
    .select-del{
    position: absolute;
    top: 0;
    right: 0;
    color: #f00;

}
.goods-type-select{

    border: 1px solid #18bc9c
}
    .goods-type {
        width: 191px;
        height: 70px;
        line-height: 35px;
        background: url(/assets/img/shopro/goods.png) no-repeat;
        display: block;
        padding: 0px 20px;
        margin-right: 10px;
    }

    .goods-typeright {
        background: url(/assets/img/shopro/xinu.png) no-repeat;
        color: #000;
    }

    /*sku选择样式*/


    .skuli {
        float: left;
        line-height: 30px;
        list-style: none;
        margin-right: 10px;
    }

    .clear {
        clear: both;
    }

    .delCusSkuVal,
    .delCusSkuType {
        font-size: 14px;
        text-decoration: none;
        color: #666;
    }

    /*表格样式*/
    table.skuTable {
        font-size: 14px;
        color: #333333;
        border-width: 1px;
        border-color: #ddd;
        margin: 30px;
        border-collapse: collapse;
    }

    table.skuTable th {
        border-width: 1px;
        padding: 10px 10px;
        border-style: solid;
        border-color: #ddd;
        color: #666;
        background-color: #ededed;
    }

    table.skuTable td {
        border-width: 1px;
        padding: 5px 10px;
        border-style: solid;
        border-color: #ddd;
        background-color: #ffffff;
        color: #777;
        widows: auto;
        text-align: center;
        font-size: 12px;
    }

    table.skuTable td input {
        width: 100%;
        /* border:none; */
        font-size: 14px;
        padding: 0;
        margin: 0;
        color: #666;
        text-align: center;
    }

    .cloneSku {
        margin: 10px 0 0 40px;
    }
    .main-type{
        margin: 10px;
    }
    .main-select{
        color: #f00;
    }
</style>
<form id="add-form" class="form-horizontal" role="form" data-toggle="validator" method="POST" action="">
    <div class="panel panel-default panel-intro">

        <div class="panel-heading">
            {:build_heading(null,FALSE)}
            <ul class="nav nav-tabs" data-field="status">
                <li class="active"><a href="#basic" data-value="" data-toggle="tab">基础信息</a></li>
                <li><a href="#skuPrce" data-value="" data-toggle="tab">规格/价格</a></li>
                <li><a href="#detail" data-value="" data-toggle="tab">商品详情</a></li>

            </ul>
        </div>

        <div class="panel-body">
            <div id="myTabContent" class="tab-content">
                <div class="tab-pane fade active in" id="basic">
                    <div class="widget-body no-padding">

                        <!-- Table1 基础信息 -->
                        <!-- 商品信息 -->
                        <div class="form-group">
                            <legend>商品信息</legend>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-xs-12 col-sm-2">{:__('Type')}:</label>
                            <input type="hidden" id="goods-type-name" name="row[type]" value="normal">
                            <div class="col-xs-12 col-sm-8 row-flex">
                                <div class="goods-type goods-typeleft goods-type-select" data-type="normal"></div>
                                <!-- <div class="goods-type goods-typeright" data-type="virtual"></div> -->
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-xs-12 col-sm-2">{:__('Title')}:</label>
                            <div class="col-xs-12 col-sm-8">
                                <input id="c-title"  class="form-control" name="row[title]" type="text">
                            </div>
                        </div>

                        <!--    店铺 id start    -->
                        <div class="form-group">
                            <label class="control-label col-xs-12 col-sm-2">{:__('Store_id')}:</label>
                            <div class="col-xs-12 col-sm-8">
                                <input id="c-store_id" data-source="manystore/index/index" data-field="nickname" class="form-control selectpage" name="row[store_id]" type="text" value="0">
                            </div>
                        </div>
                        <!--    店铺 id   end    -->


                        <div class="form-group">
                            <label class="control-label col-xs-12 col-sm-2">{:__('Subtitle')}:</label>
                            <div class="col-xs-12 col-sm-8">
                                <input id="c-subtitle" class="form-control" name="row[subtitle]" type="text">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-xs-12 col-sm-2">{:__('Status')}:</label>
                            <div class="col-xs-12 col-sm-8">

                                <div class="radio">
                                    {foreach name="statusList" item="vo"}
                                    <label for="row[status]-{$key}"><input id="row[status]-{$key}" name="row[status]"
                                            type="radio" value="{$key}" {in name="key" value="up" }checked{/in} />
                                        {$vo}</label>
                                    {/foreach}
                                </div>

                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-xs-12 col-sm-2">{:__('Weigh')}:</label>
                            <div class="col-xs-12 col-sm-8">
                                <input id="c-weigh"  class="form-control" name="row[weigh]"
                                    type="number" value="0">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-xs-12 col-sm-2">{:__('Category_ids')}:</label>
                            <div class="col-xs-12 col-sm-8">
                                <input id="c-category_ids"  data-source="shopro/category/selectpage"
                                    data-multiple="true" class="form-control selectpage" name="row[category_ids]"
                                    type="text" value="">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-xs-12 col-sm-2">{:__('Image')}:</label>
                            <div class="col-xs-12 col-sm-8">
                                <div class="input-group">
                                    <input id="c-image"  class="form-control" size="50" name="row[image]" type="text">
                                    <div class="input-group-addon no-border no-padding">
                                        <span><button type="button" id="plupload-image" class="btn btn-danger plupload"
                                                data-input-id="c-image"
                                                data-mimetype="image/gif,image/jpeg,image/png,image/jpg,image/bmp"
                                                data-multiple="false" data-preview-id="p-image"><i
                                                    class="fa fa-upload"></i> {:__('Upload')}</button></span>
                                        <span><button type="button" id="fachoose-image" class="btn btn-primary fachoose"
                                                data-input-id="c-image" data-mimetype="image/*" data-multiple="false"><i
                                                    class="fa fa-list"></i> {:__('Choose')}</button></span>
                                    </div>
                                    <span class="msg-box n-right" for="c-image"></span>
                                </div>
                                <ul class="row list-inline plupload-preview" id="p-image"></ul>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-xs-12 col-sm-2">{:__('Images')}:</label>
                            <div class="col-xs-12 col-sm-8">
                                <div class="input-group">
                                    <input id="c-images"  class="form-control" size="50" name="row[images]" type="text">
                                    <div class="input-group-addon no-border no-padding">
                                        <span><button type="button" id="plupload-images" class="btn btn-danger plupload"
                                                data-input-id="c-images"
                                                data-mimetype="image/gif,image/jpeg,image/png,image/jpg,image/bmp"
                                                data-multiple="true" data-preview-id="p-images"><i
                                                    class="fa fa-upload"></i> {:__('Upload')}</button></span>
                                        <span><button type="button" id="fachoose-images"
                                                class="btn btn-primary fachoose" data-input-id="c-images"
                                                data-mimetype="image/*" data-multiple="true"><i class="fa fa-list"></i>
                                                {:__('Choose')}</button></span>
                                    </div>
                                    <span class="msg-box n-right" for="c-images"></span>
                                </div>
                                <ul class="row list-inline plupload-preview" id="p-images"></ul>
                            </div>
                        </div>

                        <!-- 显示信息 -->

                        <div class="form-group">
                            <legend>显示信息</legend>
                        </div>

                        <div class="form-group">
                            <label class="control-label col-xs-12 col-sm-2">{:__('Price')}:</label>
                            <div class="col-xs-12 col-sm-8">
                                <input id="c-price" class="form-control" name="row[price]" type="text">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-xs-12 col-sm-2">{:__('Original_price')}:</label>
                            <div class="col-xs-12 col-sm-8">
                                <input id="c-original_price"  class="form-control" step="0.01" name="row[original_price]" type="number" value="0.00">
                            </div>
                        </div>

                        <!--商品分销新增字段 start-->

                        <div class="form-group">
                            <label class="control-label col-xs-12 col-sm-2">{:__('是否外卖商品')}:</label>
                            <div class="col-xs-12 col-sm-8">
                                <div class="radio">
                                    {foreach name="isTakeOutList" item="vo"}
                                    <label for="row[is_take_out]-{$key}">
                                        <input id="row[is_take_out]-{$key}" name="row[is_take_out]" type="radio" value="{$key}" {in name="key" value="1" }checked{/in}/>
                                        {$vo}
                                    </label>
                                    {/foreach}
                                </div>
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="control-label col-xs-12 col-sm-2">{:__('Goods_cost_price')}:</label>
                            <div class="col-xs-12 col-sm-8">
                                <input id="c-goods_cost_price"  class="form-control" step="0.01" name="row[goods_cost_price]" type="number" value="0.00">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-xs-12 col-sm-2">{:__('Goods_profit')}:</label>
                            <div class="col-xs-12 col-sm-8">
                                <input id="c-goods_profit"  class="form-control" step="0.01" name="row[goods_profit]" type="number" value="0.00" readonly>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-xs-12 col-sm-2">{:__('Goods_commission1')}:</label>
                            <div class="col-xs-12 col-sm-8">
                                <input id="c-goods_commission1"  class="form-control" step="0.01" name="row[goods_commission1]" type="number" value="0.00">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-xs-12 col-sm-2">{:__('Goods_commission2')}:</label>
                            <div class="col-xs-12 col-sm-8">
                                <input id="c-goods_commission2"  class="form-control" step="0.01" name="row[goods_commission2]" type="number" value="0.00">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-xs-12 col-sm-2">{:__('Goods_commission3')}:</label>
                            <div class="col-xs-12 col-sm-8">
                                <input id="c-goods_commission3"  class="form-control" step="0.01" name="row[goods_commission3]" type="number" value="0.00">
                            </div>
                        </div>
                        <!--商品分销新增字段   end-->

                        <div class="form-group">
                            <label class="control-label col-xs-12 col-sm-2">{:__('Likes')}:</label>
                            <div class="col-xs-12 col-sm-8">
                                <input id="c-likes"  class="form-control" name="row[likes]"
                                    type="number" value="0">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-xs-12 col-sm-2">{:__('Views')}:</label>
                            <div class="col-xs-12 col-sm-8">
                                <input id="c-views"  class="form-control" name="row[views]"
                                    type="number" value="0">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-xs-12 col-sm-2">{:__('Sales')}:</label>
                            <div class="col-xs-12 col-sm-8">
                                <input id="c-sales"  class="form-control" name="row[sales]"
                                    type="number" value="0">
                            </div>
                        </div>


                        <div class="form-group">
                            <label class="control-label col-xs-12 col-sm-2">{:__('Is_index')}:</label>
                            <div class="col-xs-12 col-sm-8">

                                <div class="radio">
                                    {foreach name="isIndexList" item="vo"}
                                        <label for="row[is_index]-{$key}">
                                            <input id="row[is_index]-{$key}" name="row[is_index]" type="radio" value="{$key}" {in name="key" value="up" }checked{/in}/>
                                            {$vo}
                                        </label>
                                    {/foreach}
                                </div>

                            </div>
                        </div>


                        <!-- 发货信息 -->
                        <div class="form-group">
                            <legend>发货信息</legend>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-xs-12 col-sm-2">{:__('Dispatch_type')}:</label>
                            <div class="col-xs-12 col-sm-8">

                                <select id="c-dispatch_type" class="form-control selectpicker" multiple=""
                                    name="row[dispatch_type][]" >
                                    {foreach name="dispatchTypeList" item="vo"}
                                    
                                    {if condition="$vo == '物流快递'"}
                                    <option value="{$key}" {in name="key" value="" }selected{/in}>{$vo}</option>
                                    {/if}
                                    {/foreach}
                                </select>

                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-xs-12 col-sm-2">{:__('Dispatch_ids')}:</label>
                            <div class="col-xs-12 col-sm-8">
                                <input id="c-dispatch_ids"  data-source="shopro/dispatch/dispatch/index"
                                       data-multiple="false" class="form-control selectpage" name="row[dispatch_ids]"
                                       type="text" value="">
                            </div>
                        </div>
                    </div>
                </div>
                <!-- Table1 基础信息end -->
                <!-- Table2 规格价格 -->
                {include file="shopro/goods/sku" /}

                <!-- Table2 规格价格end -->

                <div class="tab-pane fade" id="detail">
                    <div class="widget-body no-padding">

                        <!-- Table3 商品详情 -->
                        <div class="form-group">
                            <legend>商品详情</legend>
                        </div>

                        <!-- 商品详情 -->
                        <div class="form-group">
                            <label class="control-label col-xs-12 col-sm-2">{:__('Service_ids')}:</label>
                            <div class="col-xs-12 col-sm-8">
                                <input id="c-service_ids" data-source="shopro/goods_service/index"
                                    data-multiple="true" class="form-control selectpage" name="row[service_ids]"
                                    type="text" value="">
                            </div>
                        </div>

                        <!-- <div class="form-group">
                            <label class="control-label col-xs-12 col-sm-2"></label>
                            <div class="col-xs-12 col-sm-8">
                                <input id="c-params" class="form-control" name="row[params]" type="text">
                            </div>
                        </div> -->


                            <div class="form-group row">
                                <label class="control-label col-xs-12 col-sm-2">{:__('Params')}:</label>
                                <div class="col-xs-12 col-sm-8">
                                    <dl class="fieldlist" data-template="basictpl" data-name="row[params]">
                                        <dd>
                                            <ins>参数名称</ins>
                                            <ins>内容</ins>
                        
                                        </dd>
                                        <dd><a href="javascript:;" class="btn btn-sm btn-success btn-append"><i class="fa fa-plus"></i> {:__('Append')}</a></dd>
                                        <!--请注意 dd和textarea间不能存在其它任何元素，实际开发中textarea应该添加个hidden进行隐藏-->
                                        <textarea name="row[params]" class="form-control hide" cols="30" rows="5"></textarea>
                                    </dl>
                                    <script id="basictpl" type="text/html">
                                        <dd class="form-inline">
                                           
                                            <ins><input type="text" name="<%=name%>[<%=index%>][title]" class="form-control" value="<%=row.title%>" placeholder="参数名称"/></ins>
                                            <ins><input type="text" name="<%=name%>[<%=index%>][content]" class="form-control" value="<%=row.content%>" placeholder="内容"/></ins>
                                            <!--下面的两个按钮务必保留-->
                                            <span class="btn btn-sm btn-danger btn-remove"><i class="fa fa-times"></i></span>
                                            <span class="btn btn-sm btn-primary btn-dragsort"><i class="fa fa-arrows"></i></span>
                                        </dd>
                                    </script>
                                </div>
                            </div>


                        <div class="form-group">
                            <label class="control-label col-xs-12 col-sm-2">{:__('Content')}:</label>
                            <div class="col-xs-12 col-sm-8">
                                <textarea id="c-content" class="form-control editor" rows="5" name="row[content]"
                                    cols="50"></textarea>
                            </div>
                        </div>
                        <!-- Table3 商品详情end -->
                    </div>
                </div>

            </div>
        </div>
        
    </div>
    <div class="form-group layer-footer">
        <label class="control-label col-xs-12 col-sm-2"></label>
        <div class="col-xs-12 col-sm-8">
            <button type="button" class="btn btn-success btn-embossed" id="submitBtn">{:__('OK')}</button>
            <!-- <button type="reset" class="btn btn-default btn-embossed">{:__('Reset')}</button> -->
        </div>
    </div>


</form>

<script type="application/javascript">
    $(function(){
        $("#c-price").blur(function(){
            $("#c-goods_profit").val($("#c-price").val()-$("#c-goods_cost_price").val())
        });
        $("#c-goods_cost_price").blur(function(){
            $("#c-goods_profit").val($("#c-price").val()-$("#c-goods_cost_price").val())
        })
        $("#c-goods_commission1").blur(function(){
            let commission = Number($("#c-goods_commission1").val()) + Number($("#c-goods_commission2").val()) + Number($("#c-goods_commission3").val());
            if(commission > Number($("#c-goods_profit").val())){
                layer.msg('佣金总和不能大于利润');
            }
        })
        $("#c-goods_commission2").blur(function(){
            let commission = Number($("#c-goods_commission1").val()) + Number($("#c-goods_commission2").val()) + Number($("#c-goods_commission3").val());
            if(commission > Number($("#c-goods_profit").val())){
                layer.msg('佣金总和不能大于利润');
            }
        })
        $("#c-goods_commission3").blur(function(){
            let commission = Number($("#c-goods_commission1").val()) + Number($("#c-goods_commission2").val()) + Number($("#c-goods_commission3").val());
            if(commission > Number($("#c-goods_profit").val())){
                layer.msg('佣金总和不能大于利润');
            }
        })
    })

</script>